import { View, Button, Text, Image } from '@tarojs/components';
import * as React from 'react';
import Taro from '@tarojs/taro';
import './index.scss'
import PdsUpLoaderImage from '@/components/common/pds_uploader_image';
import { formatRule } from '@/utils/fomatter';
import { setWalletEvidence, submitEvidence } from '@/services/api/eligible_investors';
import apiConfig from '@/services/apiConfig'
import { Toast } from '@antmjs/vantui';

interface EvidenceProps { }


class Evidence extends React.Component<EvidenceProps, any> {

    constructor(props) {
        super(props);
        this.state = {
            value: [],
            className: 'hideText',
            defaultExpand: false,
            certAttachment: '',
            assetAttachment: '',
            otherAttachment: '',
            frontId: '',
            frontName: '',
            backId: '',
            backName: '',
            isRead: false,
        }
    }

    // 建议在页面初始化时把 getCurrentInstance() 的结果保存下来供后面使用，
    // 而不是频繁地调用此 API
    $instance = Taro.getCurrentInstance()

    componentWillMount() {
        // 获取传递的 map 对象
        var params = this.$instance.router?.params
        console.log(params);
        if (params != null) {
            if (params['investConfirmAuthStatus'] === '2') {
                // 仅查看
                this.setState({ isRead: true })
            }
            if (params['certAttachment'] && params['certAttachment']?.length > 0) {
                const cert = params['certAttachment'].split(';');
                if (cert.length >= 2) {
                    const front = cert[0].split(':');
                    const back = cert[1].split(':');
                    this.setState({ frontId: front[0], frontName: front[0], backId: back[0], backName: back[1], })
                }
                this.setState({ certAttachment: params['certAttachment'] })
            }
            if (params['assetAttachment'] && params['assetAttachment']?.length > 0) {
                this.setState({ assetAttachment: params['assetAttachment'] })
            }
            if (params['otherAttachment'] && params['otherAttachment']?.length > 0) {
                this.setState({ otherAttachment: params['otherAttachment'] })
            }
        }
    }


    expandText = () => {
        const { defaultExpand } = this.state
        this.setState({ defaultExpand: !defaultExpand })
        if (defaultExpand) {
            this.setState({ className: 'hideText' })
        } else {
            this.setState({ className: '' })
        }
    }

    /**
     * 
     * @returns 
     */
    submit() {
        const { assetAttachment, otherAttachment, frontId, frontName, backId, backName } = this.state
        if (frontId.length == 0) {
            Toast.fail('请上传身份证正面')
            return;
        }
        if (backId.length == 0) {
            Toast.fail('请上传身份证反面')
            return;
        }
        if (assetAttachment.length == 0) {
            Toast.fail('请上传资产证明材料')
            return;
        }
        if (otherAttachment.length == 0) {
            Toast.fail('请上传其他证明材料')
            return;
        }

        var params = this.$instance.router?.params
        console.log(params);
        if (params && params['isJG'] === '1') {

            submitEvidence(assetAttachment, otherAttachment, frontId, frontName, backId, backName).then((rep) => {
                if (rep.code === 200) {
                    Toast.show('保存成功')
                    Taro.navigateBack()
                }
            });

        } else {
            setWalletEvidence(assetAttachment, otherAttachment, frontId, frontName, backId, backName).then((rep) => {
                if (rep.code === 200) {
                    Toast.show('保存成功')
                    // Taro.navigateBack()
                }
            });
        }

    }

    // /// 机构 -- 用户展示的图片路径
    // String userImageURL = '${baseURL}api/v1/file/download/user/file?file_id=';
    // /// 用户 -- 用户展示的图片路径
    // String ucsUserImageURL =
    //     '${baseURL}api/v1/file/download/ucs/user_file?file_id=';

    render() {
        const { defaultExpand, className, frontId, backId, otherAttachment, assetAttachment, isRead } = this.state
        return (
            <View className='page'>
                <View className='content'>
                    <View className='content-item identification '>
                        <Text className='name'>身份证明材料</Text>
                        <Text className='desc'>请上传身份证正反面</Text>
                        <View className='upimage identification-upimage'>
                            <PdsUpLoaderImage disabled={isRead} imageurl={`${apiConfig.baseUrl + '/api/v1/' + 'file/download/user/file?file_id=' + frontId}`} onUpload={(filename, fileid) => {
                                this.setState({ frontId: fileid, frontName: filename })
                            }} onDelete={() => {
                                this.setState({ frontId: '', frontName: '', })
                            }}></PdsUpLoaderImage>
                            <PdsUpLoaderImage disabled={isRead} imageurl={`${apiConfig.baseUrl + '/api/v1/' + 'file/download/user/file?file_id=' + backId}`} onUpload={(filename, fileid) => {
                                this.setState({ backId: fileid, backName: filename, })
                            }} onDelete={() => {
                                this.setState({ backId: '', backName: '', })
                            }}></PdsUpLoaderImage>
                        </View>
                    </View>
                    <View className='content-item asset'>
                        <Text className='name'>资产规模证明材料</Text>
                        <View className='desc'>
                            <Text className={className}>
                                {formatRule(' 根据《私募投资基金募集行为管理办法》第二十八条规定，投资者购买私募基金必须满足合格投资者标准，请您根据下方提示上传符合标准的相应文件（二选一）。\n')}
                                <Text className='desc-bold'>① 收入证明：</Text> {formatRule('最近3年个人年均收入不低于50万元的个人收入证明；\n')}
                                <Text className='desc-bold'>② 资产证明：</Text>不低于300万元的金融资产证明。
                            </Text>
                            <View className='expand-button' onClick={this.expandText.bind(this)}>
                                <Image src={require(`@/assets/icons/public/${defaultExpand ? 'public-border-arrow-top' : 'public-border-arrow-bottom'}.svg`)} style={{ width: 16, height: 16 }} ></Image>
                                <Text> {defaultExpand ? '收起' : '展开'} </Text>
                            </View>
                        </View>
                        <View className='upimage'>
                            <PdsUpLoaderImage disabled={isRead} imageurl={assetAttachment.length == 0 ? '' : `${apiConfig.baseUrl + '/api/v1/file/download/user/file?file_id=' + assetAttachment.split(':')[0]}`} onUpload={(filename, fileid) => {
                                this.setState({ assetAttachment: `${fileid}:${filename}` })
                            }} onDelete={() => {
                                this.setState({ assetAttachment: '' })
                            }}></PdsUpLoaderImage>
                        </View>
                    </View>
                    <View className='content-item other'>
                        <Text className='name'>其他证明材料</Text>
                        <Text className='desc'>请上传转账银行卡正面照片</Text>
                        <View className='upimage'>
                            <PdsUpLoaderImage disabled={isRead} imageurl={otherAttachment.length == 0 ? '' : `${apiConfig.baseUrl + '/api/v1/file/download/user/file?file_id=' + otherAttachment.split(':')[0]}`} onUpload={(filename, fileid) => {
                                this.setState({ otherAttachment: `${fileid}:${filename}` })
                            }} onDelete={() => {
                                this.setState({ otherAttachment: '' })
                            }}></PdsUpLoaderImage>
                        </View>
                    </View>
                </View>
                {
                    isRead ? null :
                        <View className='bottom'>
                            <Button onClick={this.submit.bind(this)}>提交</Button>
                        </View>
                }
                <Toast></Toast>

            </View>
        );
    }
}

export default Evidence;